<!-- author: wangyibo -->
<!-- date: 2022-07-13 14:19:30 -->
<!-- description: 字典表数据回显 -->
<template>
  <div>
    <template v-for="(item, index) in options" :key="index">
      <template v-if="values.includes(item.value)">
        <span v-if="tag == false || item.elTagType == 'default' || item.elTagType == ''" :class="item.elTagType">{{ item.label + " " }}</span>
        <el-tag v-else :disable-transitions="true" :type="item.elTagType === 'primary' ? '' : item.elTagType" :class="item.elTagType">
          {{ item.label }}
        </el-tag>
      </template>
    </template>
  </div>
</template>

<script setup>
const $props = defineProps({
  // 数据
  options: {
    type: Array,
    default: null
  },
  tag: {
    type: [String, Boolean],
    default: false
  },
  // 当前的值
  value: {
    type: [Number, String, Array],
    default: ""
  }
});

//处理接受的value值
const values = computed(() => {
  if ($props.value !== null && typeof $props.value !== "undefined") {
    return Array.isArray($props.value) ? $props.value : [String($props.value)];
  } else {
    return [];
  }
});
</script>

<style scoped>
.el-tag + .el-tag {
  margin-left: 10px;
}
</style>
